<template>
  <div>

    <el-main>
    <!-- This is 教师监考 page！ -->

      <!-- 面包屑 -->
      <div class="bg-breadcrumb" style="margin-bottom: 15px;">
        <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item :to="{ path: '/teacher/teacherhomepage' }">首页</el-breadcrumb-item>
          <el-breadcrumb-item>监考管理</el-breadcrumb-item>
        </el-breadcrumb>
      </div>

      <!-- 展示教师监考安排的列表 -->
      <!-- <el-card shadow="always" :body-style="{ padding: '20px' }">
        <div slot="header">
          <el-row :gutter="20">
            <el-col :span="12" :offset="0">
              监考科目
            </el-col>
            <el-col :span="12" :offset="0">
              监考地点
            </el-col>
          </el-row>
        </div>
        <el-row :gutter="20" v-for="(item, index) in examList" :key="index">
          <el-col :span="12" :offset="0">
            {{ item.course_name }}
          </el-col>
          <el-col :span="12" :offset="0"></el-col>
        </el-row>
      </el-card> -->
      <el-card shadow="always" :body-style="{ padding: '20px' }">
        <!-- card body -->
        <el-table
          :data="examList"
          :header-cell-style="{fontSize: '18px'}"
          :cell-style="{fontSize: '18px'}"
          stripe>
          <el-table-column
            label="监考科目"
            prop="course_name"
            align="center"
            width="">
          </el-table-column>
          <el-table-column
            label="监考教室"
            prop="exam_classroom"
            align="center"
            width="">
          </el-table-column>
          <el-table-column
            label="监考日期"
            prop="exam_day"
            align="center"
            width="">
          </el-table-column>
          <el-table-column
            label="监考时间"
            prop="exam_time"
            align="center"
            width="">
          </el-table-column>
        </el-table>
      </el-card>

    </el-main>

  </div>
</template>

<script>
export default {
  data () {
    return {
      examList: [],
      currentPage: 0
    }
  },
  created () {
    this.getExamList()
  },
  methods: {
    // 获取所有监考信息
    async getExamList () {
      const { data: res } = await this.$http.post(`exam/getSelfExam?page=${this.currentPage}&rows=10`)
      console.log(res)
      if (!res.state) return this.$message.error(res.msg)
      this.examList = res.detail
    }
  }
}
</script>

<style lang="less" scoped>

</style>
